<script setup>
import { ref } from "vue";
import { useStore } from "vuex"
import C from "@/components/C"
import {
   useAddFriendAplly,
} from "@/hooks/add-hook"

const store = useStore();
const user = store.state.user.userInfo
const friend_qq = ref("");
const group_number = ref("");
const show = ref(false);

const addFriendHandler =  () => {
    useAddFriendAplly(show,user._id,friend_qq,user.nick_name,user.avatar,user.qq_account,"private");
}

const addGroupHandler = () => {
    useAddFriendAplly(show,user._id,group_number,user.nick_name,user.avatar,user.qq_account,"group");
}

</script>

<template>
  <div>
    <C.Overlay :show="show"/>
    <van-cell title="添加好友" size="large" />
    <van-field v-model="friend_qq" size="large" placeholder="请输入QQ号" />
    <div style="padding: 15px">
      <van-button type="primary" size="large" @click="addFriendHandler">添加好友</van-button>
    </div>
    <van-cell title="加入群" size="large" />
    <van-field v-model="group_number" size="large" placeholder="请输入群号" />
    <div style="padding: 15px">
      <van-button type="primary" size="large" @click="addGroupHandler">加入群</van-button>
    </div>
  </div>
</template>

<style lang="scss" scoped></style>
